import React, { useState } from 'react';
import { Button, Modal } from 'antd';
import { connect } from 'react-redux';
import { Checkbox, Form, Input } from 'antd';
import type { RadioChangeEvent } from 'antd';
import { Radio } from 'antd';

export const addModel = ({ addshaModel, addclose, dispatch }: any) => {
  const [isModalOpen, setIsModalOpen] = useState(false);

  const showModal = () => {
    setIsModalOpen(true);
  };

  const handleOk = (values: any) => {
    // dispatch('sand/ADDSHA')
    console.log(values);
    addclose(false);
  };

  const handleCancel = () => {
    addclose(false);
  };

  const onFinish = (values: any) => {
    // console.log('Success:', values);
    dispatch({ type: 'sand/ADDSHA', payload: { ...values } });
    addclose(false);
  };

  const onFinishFailed = (errorInfo: any) => {
    // console.log('Failed:', errorInfo);
  };
  const [value, setValue] = useState(1);

  const onChange = (e: RadioChangeEvent) => {
    // console.log('radio checked', e.target.value);
    setValue(e.target.value);
  };
  return (
    <div>
      <Modal
        title="添加楼栋"
        open={addshaModel}
        onOk={() => handleOk}
        onCancel={handleCancel}
        footer={null}
      >
        <Form
          name="basic"
          labelCol={{ span: 8 }}
          wrapperCol={{ span: 16 }}
          style={{ maxWidth: 600 }}
          initialValues={{ remember: true }}
          onFinish={onFinish}
          onFinishFailed={onFinishFailed}
          autoComplete="off"
        >
          <Form.Item label="楼盘名称" name="title">
            <Input />
          </Form.Item>
          <Form.Item label="单元数">
            <Input />
          </Form.Item>
          <Form.Item label="电梯数">
            <Input />
          </Form.Item>
          <Form.Item label="总楼层" name="floor_num">
            <Input />
          </Form.Item>
          <Form.Item label="总户数" name="room_num">
            <Input />
          </Form.Item>
          <Form.Item label="销售状态" name="sale_status">
            <Radio.Group onChange={onChange} value={value}>
              <Radio value={1}>在售</Radio>
              <Radio value={2}>未售</Radio>
              <Radio value={3}>售完</Radio>
            </Radio.Group>
          </Form.Item>
          <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
            <Button
              type="primary"
              htmlType="submit"
              style={{ margin: '0 10px' }}
            >
              取消
            </Button>
            <Button type="primary" htmlType="submit">
              确定
            </Button>
          </Form.Item>
        </Form>
      </Modal>
    </div>
  );
};

const mapStateToProps = (state: any) => ({});

export default connect()(addModel);
